<include file="public@header" />
</head>
<body>
	<div class="wrap">
		<ul class="nav nav-tabs">
			<li ><a href="{:url('Music/index')}">音乐列表</a></li>
			<li class="active"><a >{:lang('ADD')}</a></li>
		</ul>
		<form method="post" class="form-horizontal js-ajax-form margin-top-20" action="{:url('Music/addPost')}">

            <div class="form-group">
				<label for="input-name" class="col-sm-2 control-label"><span class="form-required">*</span>分类</label>
				<div class="col-md-6 col-sm-10">
					<select class="form-control" name="classify_id">
                        <option value="0">默认分类</option>
                        <volist name="classify" id="v">
                        <option value="{$key}">{$v}</option>
                        </volist>
                    </select>
				</div>
			</div>
            
            <div class="form-group">
				<label for="input-title" class="col-sm-2 control-label"><span class="form-required">*</span>名称</label>
				<div class="col-md-6 col-sm-10">
					<input type="text" class="form-control" id="input-title" name="title">
				</div>
			</div>
            
            <div class="form-group">
				<label for="input-author" class="col-sm-2 control-label"><span class="form-required">*</span>演唱者</label>
				<div class="col-md-6 col-sm-10">
					<input type="text" class="form-control" id="input-author" name="author">
				</div>
			</div>
            
            <div class="form-group">
				<label for="input-user_login" class="col-sm-2 control-label"><span class="form-required">*</span>封面</label>
				<div class="col-md-6 col-sm-10">
					<input type="hidden" name="img_url" id="thumbnail" value="">
                    <a href="javascript:uploadOneImage('图片上传','#thumbnail');">
                        <img src="__TMPL__/public/assets/images/default-thumbnail.png"
                                 id="thumbnail-preview"
                                 style="cursor: pointer;max-width:100px;max-height:100px;"/>
                    </a>
                    <input type="button" class="btn btn-sm btn-cancel-thumbnail" value="取消图片"> 建议尺寸： 200 X 200
				</div>
			</div>
            
            <div class="form-group">
				<label for="input-length" class="col-sm-2 control-label"><span class="form-required">*</span>上传音乐</label>
				<div class="col-md-6 col-sm-10">
                    <input class="form-control" type="file" name="file" id="upfile" style="width: 300px;display: inline-block;"/>
                    <!-- <input class="form-control" id="js-file-input" type="text" name="file_url" value="" style="width: 300px;display: inline-block;" title="文件名称">
                        <a href="javascript:uploadOne('文件上传','#js-file-input','audio');">上传文件</a> -->MP3格式
                        
				</div>
			</div>
            
            <div class="form-group">
				<label for="input-length" class="col-sm-2 control-label"></label>
				<div class="col-md-6 col-sm-10">
					<audio id="audio" controls="" style="display: none;"></audio>
				</div>
			</div>
            
            <div class="form-group">
				<label for="input-length" class="col-sm-2 control-label"><span class="form-required">*</span>音乐长度</label>
				<div class="col-md-6 col-sm-10">
					<input type="text" class="form-control" id="input-length" name="length" value="" style="width: 300px;display: inline-block;" readonly> 上传时自动获取
				</div>
			</div>
            
            <div class="form-group">
				<label for="input-use_nums" class="col-sm-2 control-label"><span class="form-required">*</span>被使用次数</label>
				<div class="col-md-6 col-sm-10">
					<input type="text" class="form-control" id="input-use_nums" name="use_nums" value="0">填写正整数
				</div>
			</div>
            
			<div class="form-group">
				<div class="col-sm-offset-2 col-sm-10">
					<button type="submit" class="btn btn-primary js-ajax-submit">{:lang('ADD')}</button>
					<a class="btn btn-default" href="javascript:history.back(-1);">{:lang('BACK')}</a>
				</div>
			</div>
            
		</form>
	</div>
	<script src="__STATIC__/js/admin.js"></script>
    <script>
        Wind.use('layer');
        (function(){
            $('.btn-cancel-thumbnail').click(function () {
                $('#thumbnail-preview').attr('src', '__TMPL__/public/assets/images/default-thumbnail.png');
                $('#thumbnail').val('');
            });
        })()
        
        $(function () {  
            $("#upfile").change(function () {
                
                //获取文件类型
            	var a=$("#upfile").val();
            	var arr=a.split('.');
            	var type=arr[arr.length-1];
            	if(type.toLowerCase()!="mp3"){
            		layer.msg("请上传MP3格式文件");
            		$("#submit").attr("disabled","true");
            		return;
            	}
                
                var objUrl = getObjectURL(this.files[0]);  
                $("#audio").attr("src", objUrl);  
                //$("#audio")[0].play();  
                $("#audio").show();  
                getTime();  
            });  
        }); 


        //获取mp3文件的时间 兼容浏览器  
        function getTime() {  
            setTimeout(function () {  
                var duration = $("#audio")[0].duration;  
                if(isNaN(duration)){  
                    //layer.msg("文件错误，请重新选择");
                    getTime();
                    return !1;
                }  

                //console.log($("#audio")[0]); 
               // console.info("该歌曲的总时间为："+$("#audio")[0].duration+"秒");
                var length=Math.floor($("#audio")[0].duration); //获取音乐长度

                if(length<15){ //长度小于15秒
                    layer.msg('音乐长度不能低于15秒');
                }

                var len_str="00:00";
                if(length>60){
                    var minute=Math.floor(length/60);
                    var second=length%60;
                    if(minute<10){
                        minute="0"+minute;
                    }
                    if(second<10){
                        second="0"+second;
                    }
                    len_str=minute+":"+second;

                }else{
                    if(length<10){
                        length="0"+length;
                    }
                    len_str="00:"+length;
                }

                //console.log(len_str);
                $("#input-length").val(len_str);
            }, 50);  
        }  
        //把文件转换成可读URL 
        function getObjectURL(file) {
            var url = null;  
            if (window.createObjectURL != undefined) { // basic  
                url = window.createObjectURL(file);  
            } else if (window.URL != undefined) { // mozilla(firefox)  
                url = window.URL.createObjectURL(file);  
            } else if (window.webkitURL != undefined) { // webkit or chrome  
                url = window.webkitURL.createObjectURL(file);  
            }  
            return url;  
        }
    </script>
</body>
</html>